Hidden Properties

The Hidden control type displays a grid column (or row), but does not display any data. This is different from the Hide property, that hides a grid column (or row). In this example we would like to achieve three goals:

  1. Set the value of a field with a script in the CanInsertRecord event

  2. Display the value of said field.

  3. Prevent the user from editing the field.

Updating Hidden Grid Fields using dbf:

  1. Open the Grid Builder and go to the Design tab. Go to the Component Type page and select Grid is: Updatable . On the Data Source page select .dbf .

  2. On the Query(DBF) page connect to the table that you will extract data from. This example uses the AlphaSports Customers table.

  3. If you are using Query(DBF) click the Calculated fields button. The Calculated Values dialog will open. Create a calculated field definition similar to the one below and click OK .

    cust_id = customer_id
    This calculated field definition takes the customer_id field in the Alpha Sports customers table and creates a new identical field named cust_id. This copy can be displayed but be placed in a non-editable label control.
  4. Open to the grid Fields page. Take the two fields that appeared in your calculated field definition and move them from the Available fields: list to the Selected: fields list.

  5. Add two additional fields to the Selected: fields list from the Available fields list. Position these fields in the middle of the Selected: fields list using the up and down arrows.

  6. Go to Live Preview . Your table should look something like this.

    images/01_hide.png
  7. In the Selected: fields list, click on the control of the field you copied in your calculated field definition; this example uses Customer_id.

  8. Go to the Field Properties list for this field control. Find the Display Settings section and under it the Control type property. Change Control type to ' Hidden

    images/01_hide3.png
  9. Scroll down the Field Properties list to the Column Properties section. Check the Hide column property checkbox.

  10. In the Selected: fields list, select the second field, in this case the firstname field.

  11. In the Field Properties list go to the Column Properties section again.

  12. Find the Column heading property and change it, in this case to 'First Name'. Also change the Heading in-line style property to ' text-align: left '.

    images/01_hide4.png
  13. Check the Freeform layout property checkbox. The Freeform template property will appear. Click the button next to it to open the Freeform Column Layout dialog.

  14. In the Freeform Column Layout dialog enter a field definition similar to the one below and click OK.

    {Customer_Id}{Firstname}
    This step is important. This step places the editable field that you copied, in this example "customer_ID", on the grid. This allows the event script to modify it. However, since, the "customer_ID" control is hidden, only the "firstname" field shows.
  15. Click on the third field in your Selected: fields list, in this case the "lastname" field.

  16. In Column Properties change the Column heading property, in this case to "Last Name", and set Heading in-line style to "text-align: left;"

    images/01_hide5.png
  17. Finally, click on your calculated field in the Selected: fields list. Go back to the Column Properties section of the Field Properties list.

  18. Change the Column heading property. In this example our calculated field is cust_id so the heading will be "Customer ID". Also change the Heading in-line style property to "text-align: left;"

  19. Scroll up to the Display Setting section of the Field Properties list. Change the Control type to ' Label '.

    images/01_hide6.png
  20. From the Design menu, open then Properties page. Find the Layout Options section and under it the Rows of data property. Set Rows of data to 5.

    images/01_hide7.png
  21. Now click on the Update Settings page. Find the Permissions section of the page and in it the Number of new record rows property , set this to 1.

  22. Save the grid and go to Live Preview .

    images/01_hide2.png
    Placing scripts in the CanInsertRecord event will now update the Customer_ID field.

Custom Control Properties

with tmpl.field_info[N]            
.CustomControlXbasic as C

See Also